{% extends 'opd/master/layout.html'%}
<meta charset="UTF-8">
  
  {% block css %}
	

 {% endblock %}
  {% block body %}
	<div id="content">
        <div class="container">
          <div class="crumbs">
            <ul id="breadcrumbs" class="breadcrumb">
              <li>
                <i class="icon-home">
                </i>
                <a href="index.html">
                  服务器定时任务添加
                </a>
              </li>
              <li class="current">
                <a href="pages_calendar.html" title="">
                  多台定时任务添加
                </a>
              </li>
            </ul>
            <ul class="crumb-buttons">
              <li>
                <a href="charts.html" title="">
                  <i class="icon-signal">
                  </i>
                  <span>
                    Statistics
                  </span>
                </a>
              </li>
              <li class="dropdown">
                <a href="#" title="" data-toggle="dropdown">
                  <i class="icon-tasks">
                  </i>
                  <span>
                    Users
                    <strong>
                      (+3)
                    </strong>
                  </span>
                  <i class="icon-angle-down left-padding">
                  </i>
                </a>
                <ul class="dropdown-menu pull-right">
                  <li>
                    <a href="form_components.html" title="">
                      <i class="icon-plus">
                      </i>
                      Add new User
                    </a>
                  </li>
                  <li>
                    <a href="http://envato.stammtec.de/themeforest/melon/tables_dynamic.html"
                    title="">
                      <i class="icon-reorder">
                      </i>
                      Overview
                    </a>
                  </li>
                </ul>
              </li>
              <li class="range">
                <a href="#">
                  <i class="icon-calendar">
                  </i>
                  <span>
                  </span>
                  <i class="icon-angle-down">
                  </i>
                </a>
              </li>
            </ul>
          </div>
          
          <div class="row">
            <div class="col-md-12">
              <div class="widget box">
                <div class="widget-header">
                  <h4>
                    <i class="icon-reorder">
                    </i>
                    远程服务器定时任务添加
                  </h4>
                </div>
                <div class="widget-content">
                  <form class="form-horizontal row-border" action="/ansible/cronttab/" method='POST'>
                    <div class="alert alert-info fade in">
                      <i class="icon-remove close" data-dismiss="alert">
                      </i>
						<p>请注意：</p>
						<p>
						  <small>1.请选择需要添加定时任务的主机和输入任务名称(任务名称不能重复)，以及需要执行的定时任务内容。</small>
						</p>
                    </div>
				<div class="form-group">
                      <label class="col-md-3 control-label">
                        目标IDC机房筛选:
                      </label>
                     	<div class="col-sm-2" >	
								<select class="form-control" name="allidc" id="houseroomid2" onchange="servergroup2();" >
								<option selected='selected' value='-1'>请选择IDC</option>
								{% for item in allidc %}
								<option value="{{item.id}}">{{item.housename}}</option>
								{% endfor %}
							</select>
						</div>
						 <label class="col-md-3 control-label">
                        目标服务器分组筛选:
                      </label>
                     	<div class="col-sm-2" >	
								<select class="form-control" name="approval" id="housegroupid2" disabled onchange="serverget2();">
							</select>
						</div>
                    </div>
						<div class="form-group">
                      <label class="col-md-3 control-label">
                        请选择要添加任务的服务器:
                      </label>
					  <label class="col-md-2 control-label">
						<input id='selectAll' type='button' class="btn btn-xs btn-primary" value='全选'/>
						<input id='reverseAll' type='button' class="btn btn-xs btn-info" value='反选'/>
						<input id='unselectAll' type='button' class="btn btn-xs btn-success" value='全不选'/>
                      </label>
                      <div class="col-md-6" id="hostgroup2">
					   <p class="text-warning">筛选之后才会有选择的服务器</p>
					  	 <!--
						<input id='selectAll' type='button' class="btn btn-xs btn-primary" value='全选'/>
						<input id='reverseAll' type='button' class="btn btn-xs btn-info" value='反选'/>
						<input id='unselectAll' type='button' class="btn btn-xs btn-success" value='全不选'/>
						
					
					 {% for item in allhost%}
                        <label class="checkbox-inline">
					
                          <input type="checkbox" disabled id="sighost"  name="hostbox" value="{{item.id}}">
                          {{item.hostname}}
						  
                        </label>
						
                      {% endfor %}
					  -->
                      </div>
					 </div>
					<!--
					<div class="form-group">
                      <label class="col-md-3 control-label">
                        请选择要添加定时任务的服务器:
                      </label>
                      <div class="col-md-8">
						<input id='selectAll' type='button' class="btn btn-xs btn-primary" value='全选'/>
						<input id='reverseAll' type='button' class="btn btn-xs btn-info" value='反选'/>
						<input id='unselectAll' type='button' class="btn btn-xs btn-success" value='全不选'/>
					  {% for item in allhost%}
                        <label class="checkbox-inline">
					
                          <input type="checkbox"  id="sighost"  name="hostbox" value="{{item.ipaddrs}}">
                          {{item.hostname}}
						  
                        </label>
                      {% endfor %}
                      </div>
					 </div>
					 -->
                    <div class="form-group">
                      <label class="col-md-3 control-label">
                        请输入定时任务名称：
                      </label>
                      <div class="col-md-8">
                        <input type="text" name="cronname" id="pathfile" class="form-control" placeholder="请输入任务名称，且不能重复">
                      </div>
                    </div>
					  <div class="form-group">
                      <label class="col-md-3 control-label">
                        请输入定时任务用途：
                      </label>
                      <div class="col-md-8">
                        <input type="text" name="cronuse" class="form-control" placeholder="请输入任务具体的用途" >
                      </div>
                    </div>
					<div class="form-group">
                      <label class="col-md-3 control-label">
                        请输入任务执行时间：
                      </label>
                      <div class="col-md-6">
						<div class="row">
							<div class="col-md-2">
								<input class="form-control input-width-mini" id="cronminute" name="cronminute" placeholder="分"  type="text">
							</div>
							<div class="col-md-2">
								<input class="form-control input-width-mini" id="cronhour" name="cronhour" placeholder="时" type="text">
							</div>
							<div class="col-md-2">
								<input class="form-control input-width-mini" id="cronday" name="cronday" placeholder="日" type="text">
							</div>
							<div class="col-md-2">
								<input class="form-control input-width-mini" id="cronmonth" name="cronmonth" placeholder="月"  type="text">
							</div>
							<div class="col-md-2">
								<input class="form-control input-width-mini" id="cronweek" name="cronweek" placeholder="周"  type="text">
							</div>
						</div>
					  </div>
					</div>
					    <div class="form-group">
                      <label class="col-md-3 control-label">
                        请输入执行的命令或脚本：
                      </label>
                      <div class="col-md-8">
                        <input type="text" name="croncontent"  id="pathfile2" class="form-control" placeholder="例如：/bin/touch /tmp/test.txt >>/dev/null">
                      </div>
                    </div>		
					<div class="form-group">
                    <center>
                    <input class="btn btn-info" value="定制任务" id="zhengzaizhixing" onclick="return aaa(this);" type="submit">
					</center>
					</div>                 
                  </form>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>


  {% endblock %}
		{% block js %}
		
	<script type="text/javascript">
	function aaa(id){
		//$('#cronminute').attr("disabled",true);
		//$('#cronhour').attr("disabled",true);
		//$('#cronday').attr("disabled",true);
		//$('#cronmonth').attr("disabled",true);
		//$('#cronweek').attr("disabled",true);
		//$('#pathfile').attr("disabled",true);
		//$('#pathfile2').attr("disabled",true);
		/*
		var obj=document.getElementsByName('hostbox'); 
		for (var i = 0; i < obj.length; i++) {
                    if (obj[i].checked) {
                        
						
                    }
                }
		*/	
		var result=$("input[type='checkbox']").is(':checked')
		var cronname=$('#pathfile').val();
		var croncontent=$('#pathfile2').val();
		if (result==false){
			alert('请选择需要添加任务的主机...');
			return false;
		}
		if (cronname==''){
			alert('请输入任务名称');
			return false;
		}
		if (croncontent==''){
			alert('请输入任务内容');
			return false;
		}
		bb=$(id).val('正在执行，请稍后...');
		aa=$(id).attr("disabled",true);
		//$('#sighost').parents().parents().find('.checkbox-inline').children().attr("disabled",true);
		
	}
	function masterhost(){
		//$('#sighost').attr("disabled",false);
		$('#sighost').parents().parents().find('.checkbox-inline').children().attr("disabled",false);
		}
	$(function(){
		
		$('#selectAll').click(function(){
			console.log('xxx');
			
			//$('#checklist :checkbox').attr('checked',true)  相等于下面
			//$('#checkbox input[type="checkbox"]').attr('checked',true)
			$("INPUT[type='checkbox']").each( function() {
			
				$(this).attr('checked', true);
				$(this).parents('.checkbox').find('span').addClass('checked');
				});
			
		})
		
		$('#reverseAll').click(function(){
			//each循环每一个标签
			$("INPUT[type='checkbox']").each( function() {
				//$(this).attr('checked',!$(this).attr('checked'));
				$(this).attr('checked',!$(this).attr('checked'));
			})
			/*
			$("INPUT[type='checkbox']").each( function() {
				if($(this).attr('checked')) {
					$(this).attr('checked', false);
					$(this).parents('.checkbox').find('span').removeClass('checked');
				} else {
					$(this).attr('checked', true);
						$(this).parents('.checkbox').find('span').addClass('checked');
				}
				});
				*/
		})
	})
		//setInterval('testfile()',10000);
		
			function cfgfile(){
				//var path=$("#pathfile").val();
				//console.log(path);
				var chkObjs = document.getElementsByName("optionsRadios");
                for(var i=0;i<chkObjs.length;i++){
                    if(chkObjs[i].checked){
                        a=chkObjs[i].attributes["value"].value;
						var path=$("#pathfile").val();
						//console.log(a)
						$.ajax({
							url:'/getcontent/',
							//async:false,
							data:{optionsRadios:a,regular:path},
							type:'POST',
							success:function(callback){
								callback=jQuery.parseJSON(callback);
								//console.log(callback.data)
								//document.getElementById("filelist").readOnly = false;
								$("#filelist").prop('readOnly',false);
								$("#filelist").val(callback.data);
					
								}
							});
                        }
                    }
				  //window.location.reload(); 
					
				   //document.getElementById("filelist").innerHTML='修改成功.';
				   //$("#filelist").val('aaaaaa')
				   
				   }
				
				
			/*
            var chk = 0;
            window.onload=function (){
                var chkObjs = document.getElementsByName("optionsRadios");
                for(var i=0;i<chkObjs.length;i++){
                    if(chkObjs[i].checked){
                        chk = i;
						console.log
                        break;
                    }
                }
            }
			*/
			
			/*
            function check_radio(){
                var chkObjs = document.getElementsByName("optionsRadios");
                for(var i=0;i<chkObjs.length;i++){
                    if(chkObjs[i].checked){
                        a=chkObjs[i].attributes["value"].value;
						console.log(a);
                        }
                    }
                }
           
			*/
				function managercheck(){
						document.getElementById('crondtab').style.display = 'block';
						$("#crondtab1").addClass("current");
						setTimeout("showhelp()",5000);
						}
			window.onload=managercheck();
			function showhelp(){
				$(".alert-info").addClass("hidden");
			}
			function servergroup2(){
			var id=$('#houseroomid2').val();
			
			if (id!==''){
				$('#housegroupid2').removeAttr("disabled"); 
			}
			if (id==-1){
				$('#housegroupid2').attr("disabled",true);
				$("#hostgroup2").html('<p class="text-warning">筛选之后才会有选择的服务器</p>')
				return;
			}
			
					$.ajax({
						url:'/getgroup/',
						data:{nid:id},
						type:'POST',
						
						success:function(callback){
							callback=jQuery.parseJSON(callback);
						
							if (callback.status==1){
								var html = "<option selected='selected' value='-1'>请选择服务器组</option>";
								//console.log(callback.data)
								 for(var i=0; i<callback.data.length; i++){
										  html += "<option value= '"+callback.data[i].id+"'>"+callback.data[i].name+"</option>";
										  //console.log(callback.data[i].id);
										  //console.log(callback.data[i].name);
										 }
								$("#housegroupid2").html('').append(html);
								//window.location.reload();
							
							}else{
								alert('获取失败');
								}
						}
					});
	
		}
	
		function serverget2(){
			var idcid=$('#houseroomid2').val();
			var groupid=$('#housegroupid2').val();
			$.ajax({
				url:'/gethost/',
				data:{idcid:idcid,groupid:groupid},
				type:'POST',
				success:function(callback){
					callback=jQuery.parseJSON(callback);
					//console.log(callback.status);
					//console.log(callback.data.length);
					
					if (callback.status==1){
						//var html = "<input id='selectAll' type='button' class='btn btn-xs btn-primary' value='全选'/><input id='reverseAll' type='button' class='btn btn-xs btn-info' value='反选'/><input id='unselectAll' type='button' class='btn btn-xs btn-success' value='全不选'/>&nbsp&nbsp";
						var html="";
						//console.log(callback.data)
							if(callback.data.length==0){
									$("#hostgroup2").html('<p class="text-warning">此服务器组还没有服务器。</p>')
									return;
								
								}
						 for(var i=0; i<callback.data.length; i++){
						 
								 // html += "<option value= '"+callback.data[i].id+"'>"+callback.data[i].name+"</option>";
								 html += "<label class='checkbox-inline'><input type='checkbox' id='sighost'  name='hostbox' value='"+callback.data[i].ipaddrs+"'>"+callback.data[i].hostname+"</label>";
								// console.log(html);
								 //console.log(callback.data[i].id);
								  //console.log(callback.data[i].hostname);
								 }
						$("#hostgroup2").html('').append(html);
						//window.location.reload();
					
					}else{
						alert('获取失败');
						}
					
				}
			
			});
		
		
		}
	   </script>
		 {% endblock %}